<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        
    </style>
</head>
<body>
    
</body>
<script>

    // 基本使用

    // const obj = {}

    // Object.defineProperties(obj, {
    //     name: {
    //         value:"admin",
    //         writable:true,
    //         enumerable: true
    //     },
    //     age:{
    //         value:18,
    //         writable:true,
    //         enumerable: true
    //     }
    // })

    // obj.name = "root";
    // obj.age = 20;

    // for(let i in obj){
    //     console.log(i, obj[i])
    // }

    // console.log(obj)



    // 访问器和控制器的使用
    // const origin = {
    //     name:"admin",
    //     age:18
    // }

    // const target = {};

    // Object.defineProperties(target, {
    //     name: {
    //         get(){
    //             console.log("1-1")
    //             return origin.name;
    //         },
    //         set(val){
    //             console.log("1-2")
    //             origin.name = val;
    //         }
    //     },
    //     age:{
    //         get(){
    //             console.log("2-1")
    //             return origin.age;
    //         },
    //         set(val){
    //             console.log("2-2")
    //             origin.age = val;
    //         }
    //     }
    // })
    
    // console.log(target)






    // 封装：动态添加访问器和控制器

    const origin = {
        name:"admin",
        age:18,
        sex:"男"
    }

    function proxy(o){
        const t = {};
        const ops = {};

        for(let i in o){
            ops[i] = {
                get(){
                    console.log(`访问了${i}`);
                    return o[i];
                },
                set(val){
                    console.log(`修改了${i}，值为${val}`);
                    o[i] = val;
                }
            }
        }

        Object.defineProperties(t, ops);
        return t;
    }
    
    
    const target = proxy(origin);
    console.log(target);
    
    origin.msg = "hello world";

    console.log(target)

    
</script>
</html>